
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
    <title>中心管理机</title>

    <meta name="description" content="Dashboard" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="shortcut icon" href="/WisdomHome/resource/assets/img/favicon.png" type="image/x-icon">

    <link href="/WisdomHome/resource/assets/css/bootstrap.min.css" rel="stylesheet" />
    <link href="/WisdomHome/resource/assets/css/font-awesome.min.css" rel="stylesheet" />
    <link href="/WisdomHome/resource/assets/css/beyond.min.css" rel="stylesheet" type="text/css" />
    <link href="/WisdomHome/resource/assets/css/animate.min.css" rel="stylesheet" />
    <link href="/WisdomHome/resource/assets/css/dataTables.bootstrap.css" rel="stylesheet" />
    <link href="/WisdomHome/resource/ocx/css/yiduiyishipin.css" rel="stylesheet" type="text/css"/>
    <!--Skin Script: Place this script in head to load scripts for skins and rtl support-->
    <script src="/WisdomHome/resource/assets/js/skins.min.js"></script>
	<script src="/WisdomHome/resource/assets/js/jquery-2.0.3.min.js"></script>
    <script src="/WisdomHome/resource/ocx/js/common.js"></script>
	<script src="/WisdomHome/resource/ocx/js/index.js"></script>
</head>
<body onload="pageLoad()">
<OBJECT ID="ClientOCX" width="0" height="0" CLASSID="CLSID:F20C5A15-A3E3-4375-9A8B-8275489017B8"></OBJECT>
<input type="hidden" id="myvoipid"/>
<input type="hidden" id="caller_callType"/>
<input type="hidden" id="caller_callid"/>
<input type="hidden" id="caller_voip"/>
<input type="hidden" id="application"/>
<input type="hidden" id="mainAccount"/>
<input type="hidden" id="mainToken"/>
<input type="hidden" id="subAccount"/>
<input type="hidden" id="subToken"/>
<input type="hidden" id="restip"/>
<input type="hidden" id="restpost"/>
<!-- Loading Container -->
    <div class="loading-container" style="display: block;">
        <div class="loading-progress" style="display: block;">
            <div class="rotator">
                <div class="rotator">
                    <div class="rotator colored">
                        <div class="rotator">
                            <div class="rotator colored">
                                <div class="rotator colored"></div>
                                <div class="rotator"></div>
                            </div>
                            <div class="rotator colored"></div>
                        </div>
                        <div class="rotator"></div>
                    </div>
                    <div class="rotator"></div>
                </div>
                <div class="rotator"></div>
            </div>
            <div class="rotator"></div>
        </div>
    </div>
    <!--  /Loading Container -->
    <!-- Navbar -->
    <div class="navbar">
        <div class="navbar-inner">
            <div class="navbar-container">
                <!-- Navbar Barnd -->
                <div class="navbar-header pull-left">
                    <a href="#" class="navbar-brand">
                        <small>
                            <img src="/WisdomHome/resource/assets/img/logo.png" alt="" />
                        </small>
                    </a>
                </div>
                <!-- /Navbar Barnd -->

                <!-- Sidebar Collapse -->
                <div class="sidebar-collapse" id="sidebar-collapse">
                    <i class="collapse-icon fa fa-bars"></i>
                </div>
                <!-- /Sidebar Collapse -->
                <!-- Account Area and Settings --->
                <div class="navbar-header pull-right">
                    <div class="navbar-account">
                        <ul class="account-area">
                            <li>
                                <a class=" dropdown-toggle" data-toggle="dropdown" title="Help" href="#">
                                    <i class="icon fa fa-warning"></i>
                                </a>
                                <!--Notification Dropdown-->
                                <ul class="pull-right dropdown-menu dropdown-arrow dropdown-notifications">
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <div class="notification-icon">
                                                    <i class="fa fa-phone bg-themeprimary white"></i>
                                                </div>
                                                <div class="notification-body">
                                                    <span class="title">Skype meeting with Patty</span>
                                                    <span class="description">01:00 pm</span>
                                                </div>
                                                <div class="notification-extra">
                                                    <i class="fa fa-clock-o themeprimary"></i>
                                                    <span class="description">office</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <div class="notification-icon">
                                                    <i class="fa fa-check bg-darkorange white"></i>
                                                </div>
                                                <div class="notification-body">
                                                    <span class="title">Uncharted break</span>
                                                    <span class="description">03:30 pm - 05:15 pm</span>
                                                </div>
                                                <div class="notification-extra">
                                                    <i class="fa fa-clock-o darkorange"></i>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <div class="notification-icon">
                                                    <i class="fa fa-gift bg-warning white"></i>
                                                </div>
                                                <div class="notification-body">
                                                    <span class="title">Kate birthday party</span>
                                                    <span class="description">08:30 pm</span>
                                                </div>
                                                <div class="notification-extra">
                                                    <i class="fa fa-calendar warning"></i>
                                                    <i class="fa fa-clock-o warning"></i>
                                                    <span class="description">at home</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <div class="notification-icon">
                                                    <i class="fa fa-glass bg-success white"></i>
                                                </div>
                                                <div class="notification-body">
                                                    <span class="title">Dinner with friends</span>
                                                    <span class="description">10:30 pm</span>
                                                </div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="dropdown-footer ">
                                        <span>
                                            Today, March 28
                                        </span>
                                        <span class="pull-right">
                                            10°c
                                            <i class="wi wi-cloudy"></i>
                                        </span>
                                    </li>
                                </ul>
                                <!--/Notification Dropdown-->
                            </li>
                            <li>
                                <a class="wave in dropdown-toggle" data-toggle="dropdown" title="Help" href="#">
                                    <i class="icon fa fa-envelope"></i>
                                    <span class="badge">3</span>
                                </a>
                                <!--Messages Dropdown-->
                                <ul class="pull-right dropdown-menu dropdown-arrow dropdown-messages">
                                    <li>
                                        <a href="#">
                                            <img src="/WisdomHome/resource/assets/img/avatars/divyia.jpg" class="message-avatar" alt="Divyia Austin">
                                            <div class="message">
                                                <span class="message-sender">
                                                    Divyia Austin
                                                </span>
                                                <span class="message-time">
                                                    2 minutes ago
                                                </span>
                                                <span class="message-subject">
                                                    Here's the recipe for apple pie
                                                </span>
                                                <span class="message-body">
                                                    to identify the sending application when the senders image is shown for the main icon
                                                </span>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <img src="/WisdomHome/resource/assets/img/avatars/bing.png" class="message-avatar" alt="Microsoft Bing">
                                            <div class="message">
                                                <span class="message-sender">
                                                    Bing.com
                                                </span>
                                                <span class="message-time">
                                                    Yesterday
                                                </span>
                                                <span class="message-subject">
                                                    Bing Newsletter: The January Issue‏
                                                </span>
                                                <span class="message-body">
                                                    Discover new music just in time for the Grammy® Awards.
                                                </span>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <img src="/WisdomHome/resource/assets/img/avatars/adam-jansen.jpg" class="message-avatar" alt="Divyia Austin">
                                            <div class="message">
                                                <span class="message-sender">
                                                    Nicolas
                                                </span>
                                                <span class="message-time">
                                                    Friday, September 22
                                                </span>
                                                <span class="message-subject">
                                                    New 4K Cameras
                                                </span>
                                                <span class="message-body">
                                                    The 4K revolution has come over the horizon and is reaching the general populous
                                                </span>
                                            </div>
                                        </a>
                                    </li>
                                </ul>
                                <!--/Messages Dropdown-->
                            </li>

                            <li>
                                <a class="dropdown-toggle" data-toggle="dropdown" title="Tasks" href="#">
                                    <i class="icon fa fa-tasks"></i>
                                    <span class="badge">4</span>
                                </a>
                                <!--Tasks Dropdown-->
                                <ul class="pull-right dropdown-menu dropdown-tasks dropdown-arrow ">
                                    <li class="dropdown-header bordered-darkorange">
                                        <i class="fa fa-tasks"></i>
                                        4 Tasks In Progress
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">Account Creation</span>
                                                <span class="pull-right">65%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:65%" class="progress-bar"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">Profile Data</span>
                                                <span class="pull-right">35%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:35%" class="progress-bar progress-bar-success"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">Updating Resume</span>
                                                <span class="pull-right">75%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:75%" class="progress-bar progress-bar-darkorange"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            <div class="clearfix">
                                                <span class="pull-left">Adding Contacts</span>
                                                <span class="pull-right">10%</span>
                                            </div>

                                            <div class="progress progress-xs">
                                                <div style="width:10%" class="progress-bar progress-bar-warning"></div>
                                            </div>
                                        </a>
                                    </li>
                                    <li class="dropdown-footer">
                                        <a href="#">
                                            See All Tasks
                                        </a>
                                        <button class="btn btn-xs btn-default shiny darkorange icon-only pull-right"><i class="fa fa-check"></i></button>
                                    </li>
                                </ul>
                                <!--/Tasks Dropdown-->
                            </li>
                            <li>
                                <a class="login-area dropdown-toggle" data-toggle="dropdown">
                                    <div class="avatar" title="View your public profile">
                                        <img src="/WisdomHome/resource/assets/img/avatars/adam-jansen.jpg">
                                    </div>
                                    <section>
                                        <h2><span class="profile"><span>David Stevenson</span></span></h2>
                                    </section>
                                </a>
                                <!--Login Area Dropdown-->
                                <ul class="pull-right dropdown-menu dropdown-arrow dropdown-login-area">
                                    <li class="username"><a>David Stevenson</a></li>
                                    <li class="email"><a>David.Stevenson@live.com</a></li>
                                    <!--Avatar Area-->
                                    <li>
                                        <div class="avatar-area">
                                            <img src="/WisdomHome/resource/assets/img/avatars/adam-jansen.jpg" class="avatar">
                                            <span class="caption">Change Photo</span>
                                        </div>
                                    </li>
                                    <!--Avatar Area-->
                                    <li class="edit">
                                        <a href="profile.html" class="pull-left">Profile</a>
                                        <a href="#" class="pull-right">Setting</a>
                                    </li>
                                    <!--Theme Selector Area-->
                                    <li class="theme-area">
                                        <ul class="colorpicker" id="skin-changer">
                                            <li><a class="colorpick-btn" href="#" style="background-color:#5DB2FF;" rel="/WisdomHome/resource/assets/css/skins/blue.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#2dc3e8;" rel="/WisdomHome/resource/assets/css/skins/azure.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#03B3B2;" rel="/WisdomHome/resource/assets/css/skins/teal.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#53a93f;" rel="/WisdomHome/resource/assets/css/skins/green.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#FF8F32;" rel="/WisdomHome/resource/assets/css/skins/orange.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#cc324b;" rel="/WisdomHome/resource/assets/css/skins/pink.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#AC193D;" rel="/WisdomHome/resource/assets/css/skins/darkred.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#8C0095;" rel="/WisdomHome/resource/assets/css/skins/purple.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#0072C6;" rel="/WisdomHome/resource/assets/css/skins/darkblue.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#585858;" rel="/WisdomHome/resource/assets/css/skins/gray.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#474544;" rel="/WisdomHome/resource/assets/css/skins/black.min.css"></a></li>
                                            <li><a class="colorpick-btn" href="#" style="background-color:#001940;" rel="/WisdomHome/resource/assets/css/skins/deepblue.min.css"></a></li>
                                        </ul>
                                    </li>
                                    <!--/Theme Selector Area-->
                                    <li class="dropdown-footer">
                                        <a href="login.html">
                                            Sign out
                                        </a>
                                    </li>
                                </ul>
                                <!--/Login Area Dropdown-->
                            </li>
                            <!-- /Account Area -->
                            <!--Note: notice that setting div must start right after account area list.
                            no space must be between these elements-->
                            <!-- Settings -->
                        </ul><div class="setting">
                            <a id="btn-setting" title="Setting" href="#">
                                <i class="icon glyphicon glyphicon-cog"></i>
                            </a>
                        </div><div class="setting-container">
                            <label>
                                <input type="checkbox" id="checkbox_fixednavbar">
                                <span class="text">Fixed Navbar</span>
                            </label>
                            <label>
                                <input type="checkbox" id="checkbox_fixedsidebar">
                                <span class="text">Fixed SideBar</span>
                            </label>
                            <label>
                                <input type="checkbox" id="checkbox_fixedbreadcrumbs">
                                <span class="text">Fixed BreadCrumbs</span>
                            </label>
                            <label>
                                <input type="checkbox" id="checkbox_fixedheader">
                                <span class="text">Fixed Header</span>
                            </label>
                        </div>
                        <!-- Settings -->
                    </div>
                </div>
                <!-- /Account Area and Settings -->
            </div>
        </div>
    </div>
	<!-- Main Container -->
    <div class="main-container container-fluid">
        <!-- Page Container -->
        <div class="page-container">
            <!-- Page Sidebar -->
            <!-- /Page Sidebar -->
            <!-- Page Content -->
            <div class="page-content">
                <!-- Page Breadcrumb -->
                <div class="page-breadcrumbs">
                    <ul class="breadcrumb" style="margin-top: 8px;">
                        <li>
                            <i class="fa fa-home"></i>
                            <a href="#">管理系统</a>
                        </li>
                        <li>中心管理机</li>
                        <li class="active">门禁信息</li>
                    </ul>
                </div><!-- /Page Breadcrumb -->
                <!-- Page Header -->
                <div class="page-header position-relative">
                    <div class="header-title" style="margin-top: 2px;">
                        <h1>
                            门禁列表
                        </h1>
                    </div><!--Header Buttons-->
                    <div class="header-buttons">
                        <a class="sidebar-toggler" href="#">
                            <i class="fa fa-arrows-h"></i>
                        </a>
                        <a class="refresh" id="refresh-toggler" href="">
                            <i class="glyphicon glyphicon-refresh"></i>
                        </a>
                        <a class="fullscreen" id="fullscreen-toggler" href="#">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div><!--Header Buttons End-->
                </div><!-- /Page Header -->
                <!-- Page Body -->
                <div class="page-body">
                	 <div class="row">
                        <div class="col-xs-12 col-md-12">
                            <div class="widget">
                                <div class="widget-header bordered-bottom bordered-yellow">
                                    <span class="widget-caption">搜索门禁位置</span>
                                    <div class="widget-buttons">
                                        <a href="#" data-toggle="maximize">
                                            <i class="fa fa-expand"></i>
                                        </a>
                                        <a href="#" data-toggle="collapse">
                                            <i class="fa fa-minus"></i>
                                        </a>
                                        <a href="#" data-toggle="dispose">
                                            <i class="fa fa-times"></i>
                                        </a>
                                    </div>
                                </div>
                                <div class="widget-body no-padding">
                                    <table class="table table-bordered table-hover table-striped" id="searchable" style="width: 100% !important;">
                                        <thead class="bordered-darkorange">
                                            <tr role="row">
                                                <th>序号</th>
                                                <th>屏幕尺寸</th>
												<th>类型</th>
												<th>位置</th>
												<th>编号</th>
												<th>硬件号</th>
												<th>IP地址</th>
												<th>MAC地址</th>
												<th>硬件版本号</th>
												<th>软件版本号</th>
												<th>在线状态</th>
												<th>操作</th>
                                            </tr>
                                        </thead>

                                        <tfoot>
                                            <tr>
                                                <th>序号</th>
                                                <th>屏幕尺寸</th>
												<th>类型</th>
												<th>位置</th>
												<th>编号</th>
												<th>硬件号</th>
												<th>IP地址</th>
												<th>MAC地址</th>
												<th>硬件版本号</th>
												<th>软件版本号</th>
												<th>在线状态</th>
												<th>操作</th>
                                            </tr>
                                        </tfoot>
                                        <tbody>
                                          
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                    	<!-- 遮罩层 -->
						<div class="mask_hr" style="display:none;"></div>
						<!-- 通话中弹出层 -->
						<div class="dialog_th dialog" style="display:none;">
							<h3 class="title">一对一视频</h3>
						    <div class="video_win">
						    	 <div class="video_l"><div class="replayer_img">
						    	<OBJECT ID="remoteView" style="width: 350px;height: 318px" CLASSID="CLSID:3F4F173B-0F22-4EE4-8937-B0B068C3A5DA"></OBJECT>
						    	</div></div>
						    <div class="video_r">
						        	<div class="sender_img">
						        	 <OBJECT ID="localView" style="width: 144px;height: 146px" CLASSID="CLSID:3F4F173B-0F22-4EE4-8937-B0B068C3A5DA"></OBJECT>
						        	</div>
						        	<p class="person_sp">本人视频</p>
						            <div class="sp_voice">
						            	<!-- 视频语音可用 -->
						            	<!--<a href="#" class="sp_able"></a>
						            	<a href="#" class="voice_able"></a> -->
						                <!-- 视频语音不可用 -->
						                <a href="#" class="sp_disable"></a>
						                <a href="#" class="voice_disable"></a>
						            </div>    
						        </div>
						    </div>
						    <div class="btns">
						    	<span class="info_con" id="thzDiv"></span>
						    	  <a href="javascript:rejectCall();" class="dropped_btn" id="indexreject">拒接</a>
						        <a href="javascript:acceptCall();" class="start_btn" id="indexaccept">开始视频</a>
						        <a href="javascript:releaseCall();" class="end_btn">结束视频</a>
						    </div>
						</div>
                    </div>                
                </div><!-- /Page Body -->
             </div><!-- /Page Content -->
     	</div><!-- /Page Container -->
     </div><!-- /Main Container -->
     	
    <script src="/WisdomHome/resource/assets/js/bootstrap.min.js"></script>

    <!--Beyond Scripts-->
    <!-- <script src="/WisdomHome/resource/assets/js/beyond.min.js"></script> -->
    
<script src="/WisdomHome/resource/assets/js/datatable/jquery.dataTables.min.js"></script>
   <!--  <script src="/WisdomHome/resource/assets/js/datatable/ZeroClipboard.js"></script> -->
    <script src="/WisdomHome/resource/assets/js/datatable/dataTables.bootstrap.min.js"></script>
    <script src="/WisdomHome/resource/assets/js/plugin/fnReloadAjax.js"></script>
    <script type="text/javascript">
   
    function getQueryString(name){
         var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
         var r = window.location.search.substr(1).match(reg);
         if(r!=null)return  unescape(r[2]); return null;
    }
    
    
    function pageLoad(){
    	$('.loading-container').hide();
    	/* 判断是否已经安装OCX控件 */
    	if (ClientOCX.callid == undefined) {
    	  alert("您还没有安装OCX控件!");
    	 // return;
    	}
    	/* 初始化SDK，在调用其他接口之前调用。 */
    	var initParm=ClientOCX.CCPinit();
    	if(initParm!="0"&&initParm!="-1000"){
    		alert("初始化失败!");
    		//return;
    	}
    	
    	var rest_addr="app.cloopen.com";
    	var rest_port=8883;
    	var mainaccount="8a48b551506fd26f015079a930af1627";
    	var mainaccountpwd="af818a079cca4ed19ac6e378f3617259";
    	var subaccount=getQueryString("subaccount");
    	var subaccountpwd=getQueryString("subaccountpwd");
    	var voipid=getQueryString("voipid");
    	var voippwd=getQueryString("voippwd");
    	
    	console.log("subaccount:"+subaccount);
    	console.log("subaccountpwd:"+subaccountpwd);
    	console.log("voipid:"+voipid);
    	console.log("voippwd:"+voippwd);
    	var v=ClientOCX.CCPlogin(rest_addr,rest_port,mainaccount,mainaccountpwd,subaccount,subaccountpwd,voipid,voippwd);
    	if(v!='0'){
    	}else{
    		
    	}	 
    }
    
    var flag=false;
    var i=0;
    var n=true;
    function setTime(){
    	if(n){
    		i++;
    		var time=formatSeconds(i);
    		$("#thzDiv").text(time);
    		setTimeout("setTime()",1000);
    	}
    }
    
    /* 连接云通讯平台成功 回调函数 */
    function ClientOCX::OnConnected(){
   		//alert("connect success!");
   		console.log("connect success!!!");
   	}  
   	/* 连接云通讯平台失败回调函数 */
   function ClientOCX::OnConnectError(msg){
   	alert("connect error "+msg);
   	}
   	
    /* 收到voip呼叫 (此回调函数写在父页面)*/
    function ClientOCX::OnIncomingCallReceived(msg){
   	 OnIncomingCallReceived(msg);
    }
    
  //var callType
    function OnIncomingCallReceived(msg){
   		/*  解决当A呼叫B以后，再由B呼叫A，接受按不隐藏问题，
   	 原因：A呼叫B时，把自己这边的接受按钮隐藏了 */
   	 $('.answer').show();
   	 $('.hang_up').show();
   	 $('.hang_up1').hide();
   	 var json=eval('(' + msg + ')');
   		 if(!flag){
   			 $("#caller_callType").val(json.callType);
   			 $("#caller_callid").val(json.callid);
   				if(json.callType=='0'){//音频通话
   					 $("#caller_voip").val(json.caller);
   					 /* 来电voip账号 */
   					 $(".tel_info").html("来自<font color='red'><span>"+json.caller+"</span></font>的VoIP来电");
   					 $("#called").show();
   				}else{//视频通话
   					//清空上次的计时显示
   					$("#thzDiv").text("");
   				$("#indexaccept").show();
   				$("#indexaccept").attr("disabled",false);
   					$('.mask_hr').show();
   					$('.dialog_th').show();
   					$('#indexreject').hide();
   					$("#huruDiv").text(json.caller+"请您进行视频通话!");
   				}
   		 }else{//如果正在通话时，接收到voip呼叫,返回被叫忙
   			 ClientOCX.CCPrejectCall(json.callid,3);
   		 }
    }
    
    /* 消息到达事件 */
    function ClientOCX::OnReceiveInstanceMessage(msg){
   	 OnReceiveInstanceMessage(msg);
    }
    function OnReceiveInstanceMessage(msg){
   	 	//获取当前准备发送的voip
   	 	var voip=$("#currentVoip").text();
   	 	var json=eval('('+msg+')');
   	 	if(json.receiver==myvoipid){
   	 		if(json.sender==voip){
   	 			$("#send_get").append("<div class='sender'><img class='pic1' src='images/s_touxiang.jpg' alt=''/><span>"+json.message+"<img src='images/fujian.png' alt=''/></span></div>");			
   	 		}else{
   	 			var sender=json.sender;
   	 			var obj=$("[id='"+sender+"']");
   	 			var text=obj.find("em").append("<div class='sender'><img class='pic1' src='images/s_touxiang.jpg' alt=''/><span>"+json.message+"<img src='images/fujian.png' alt=''/></span></div>");
   	 			obj.find("i").attr("class","dotted");
   	 			//添加来电提示(红点)
   	 			$(".tablist").find("i").attr("class","dotted");
   	 		}
   	 	}
    }
    
    /* ----------来  电 -------------*/
    /* 挂机 */
    function CCPreleaseCall(){
    	//挂机后,接听按钮置成可用
    	$(".answer").attr("disabled",false);
    	var callid=$('#caller_callid').val();
    	var v=ClientOCX.CCPreleaseCall(callid);
    	if(v=='0'){
    		$('#called').hide();
    		$('#mask').hide();
    		$('.mask_box').hide();
    	}
    	//voip 挂断 flag状态为FALSE
    	flag=false;
    }
    /* 应答 */
    function CCPacceptCall(){
    	var callid=$('#caller_callid').val();
    	var callType=$('#caller_callType').val();
    	var v=ClientOCX.CCPacceptCall(callid,callType);
    	if(v=='0'){
    		 $('#mask').show();
    		$(".answer").attr("disabled",true);
    		//颜色置灰
    		$(".answer").css("color","gray");
    		$('#called').hide()
    		$("#yingdaMsg").show();
    		$(".gifbox").hide();
    	}
    	//voip应答flag置为通话状态
    	flag=true;
    }

    //一对一视频-拒接
    function rejectCall(){
    	var callid=$('#caller_callid').val();
    	var v=ClientOCX.CCPrejectCall(callid,3);
    	if(v!='0'){
    		alert("拒接失败!");
    	}
    	//隐藏呼叫视频弹出层
    	$('.mask_hr').hide();
    	$('.dialog_th').hide();
    }
    //一对一视频-应答
    function acceptCall(){
    	var callid=$('#caller_callid').val();
    	ClientOCX.CCPsetVideoView(remoteView.HWND, localView.HWND);
    	var v=ClientOCX.CCPacceptCall(callid,1);
    	if(v!='0'){
    		alert("应答失败!");
    	}else{//应答成功，显示“通话中”弹出层
    		//清空上次的计时显示
    		$("#thzDiv").text("");
    		$('.mask_hr').show();
    		$('.dialog_th').show();
    		//设置flag,表示此页面已经计时
    		flag=true;
    		//计时停止
    		n=true;
    		//设置时间之前把i值置0
    		i=0;
    		//设置通话时间
    		setTime();
    		//开始视频后，按钮不可用状态
    		$(".start_btn").attr("disabled",true);
    		//颜色置灰
    		$(".start_btn").css("color","gray");
    	}
    }
    //一对一视频-挂断
    function releaseCall(){
    	var callid=$('#caller_callid').val();
    	var v=ClientOCX.CCPreleaseCall(callid);
    	if(v=='0'){
    		
    	}else{
    		alert("返回值："+v);
    	}
    	//挂断后刷新页面
    	$("#rightFrame").attr("src","yiduiyishipin.html");
    	$('.mask_hr').hide();
    	$('.dialog_th').hide();
    	//计时停止
    	n=false;
    	//flag=false,视频没有使用
    	flag=false;
    }
    //应答回调事件(主叫方和被叫方都会调用)
    function ClientOCX::OnCallAnswered(msg){
    	OnCallAnswered(msg);
    }
    function OnCallAnswered(msg){
    	var type= $("#caller_callType").val();
    	var json=eval('('+msg+')');
    	if(type=='1'){//voip 视频
    		//清空上次的计时显示
    		$("#thzDiv").text("");
    		$('.mask_hr').show();
    		$('.dialog_th').show();
    		//设置flag,表示此页面已经计时
    		if(!flag){//视频没使用
    			//设置时间之前把i值置0
    			i=0;
    			//计时停止
    			n=true;
    			//设置通话时间
    			setTime();
    			flag=true;//应答成功，视频置成使用状态
    		}
    	}else{//voip 落地
    		flag=true;//应答成功，视频置成使用状态
    		$('.tel_info').text("呼叫已接通，可以进行通话!");
    		
    	}
    }
    //视频呼叫失败
    function ClientOCX::OnMakeCallFailed(msg){
    	OnMakeCallFailed(msg);
    }
    function OnMakeCallFailed(msg){
    	var json=eval('('+msg+')');
    	$('.mask_hr').hide();
    	$('.dialog_th').hide();
    	$('#mask').hide();
    	$('.mask_box').hide();
    }
    /* 挂断回调 */
    function ClientOCX::OnCallReleased (msg){
    	OnCallReleased(msg);
    }
    function OnCallReleased(msg){
    	//挂断后，隐藏消息通知提示
    	$("#called").hide();
    	$(".mask_box").hide();
    	$("#mask").hide();
    	//如果在使用状态，
    	var json=eval('('+msg+')');
    	var call_id=json.callid;
    	var callid=$('#caller_callid').val();
    		if(call_id==callid){
    		//视频div层
    		$('.mask_hr').hide();
    		$('.dialog_th').hide();
    		//对方挂机后,本地的接听按钮置成可用
    		$('#called').hide();
    		$('#mask').hide();
    		$('.mask_box').hide();
    		$(".answer").attr("disabled",false);
    		//计时停止
    		n=false;
    		//视频挂断
    		$(".start_btn").attr("disabled",false);
    		//挂断，视频置成空闲状态
    		flag=false;
    	}
    }
    //呼叫处理
    function ClientOCX::OnCallProceeding(msg){
    	 if(ClientOCX.callType == 1){
    	 	ClientOCX.CCPsetVideoView(remoteView.HWND, localView.HWND);
    	 }
    }
    /* =====================================实时对讲============================= */

    //标记是否有人正在说话
    var interphoneFlag=false;
    //实时对讲id
    var interphoneId="";
    //获取实时对讲成员
    function ClientOCX::OnInterphoneMembers(msg){
    	OnInterphoneMembers(msg);
    }
    function OnInterphoneMembers(msg){
    	var mic=false;//mic：false 表示控麦者,true 表示非控麦者
    	var type=false;//type：表示发起者true，参与者false
    	var online=false;//online：true表示在对讲中，false表示不在对讲中
    	var json=eval('('+msg+')');
    	var arr=json.members;
    	var str="";
    	for(var i=0;i<arr.length;i++){
    		mic=arr[i].mic;
    		type=arr[i].type;
    		online=arr[i].online;
    		if(online){
    			str+="<li><span class='join'>"+arr[i].voipAccount+"</span><em class='status_info'>已加入</em></li>";
    		}else{
    			str+="<li><span class='quit'>"+arr[i].voipAccount+"</span><em class='status_info'>等待加入</em></li>";
    		}
    	}
    	$('.members_list').html(str);
    	$('.mask_dj').show();
    	$(".span1").text(interphoneId);
    	$('.speak_box').fadeIn(); 
    }

    //收到实时对讲消息
    function ClientOCX::OnReceiveInterphoneMsg(msg){
    	OnReceiveInterphoneMsg(msg);
    }
    function OnReceiveInterphoneMsg(msg){
    	var json=eval('('+msg+')');
    	if(json.value=='201'){//有人邀请你参与
    	$("#newMsg").attr("onclick","joinInterphone('"+json.interphoneId+"');");
        $("#newMsg").show();
    	}else if(json.value=='202'){//有人加入
    	ClientOCX.CCPqueryMembersWithInterphone(json.interphoneId);
    	}else if(json.value=='203'){//有人退出
    		ClientOCX.CCPqueryMembersWithInterphone(json.interphoneId);//获取成员列表
    	}else if(json.value=='204'){//解散
    		interphoneId="";
    		$('.mask_dj').hide();
    		$('.speak_box').fadeOut();
    	}else if(json.value=='205'){//抢麦成功
    		interphoneFlag=true;
    		 var arrli=$('.members_list').find("li");
    		 for(var i=0;i<arrli.length;i++){
    			if($(arrli[i]).find("span").text()==json.who){
    				$(arrli[i]).find("span").css("class","speaking");
    				$(arrli[i]).find("em").text("正在讲话");
    			}
    		 }
    	}else if(json.value=='206'){//放麦成功
    		interphoneFlag=false;
    		 var arrli=$('.members_list').find("li");
    		 for(var i=0;i<arrli.length;i++){
    			if($(arrli[i]).find("span").text()==json.who){
    				$(arrli[i]).find("span").css("class","join");
    				$(arrli[i]).find("em").text("已加入");
    			}
    		 }
    	}
    }
    //抢麦按钮
    function shiftBut(){
    	if(!interphoneFlag){
    		 //抢麦
    		CCPcontrolMic();
    	}else{
    		//释放麦
    		CCPreleaseMic();
    	}
    }
     //抢麦
    function CCPcontrolMic(){
    	var v=ClientOCX.CCPcontrolMic(interphoneId);
    	if(v!='0'){
    		$(".a1").hide();
    		$(".a2").show();
    		$(".a3").hide();
    	}else{//抢麦成功
    		$(".a1").hide();
    		$(".a2").hide();
    		$(".a3").show();
    	}
    }
    //释放麦
    function CCPreleaseMic(){
    var v=ClientOCX.CCPreleaseMic(interphoneId);
    if(v!='0'){
    	$(".a1").hide();
    	$(".a2").show();
    	$(".a3").hide();
    }else{
    	$(".a1").show();
    	$(".a2").hide();
    	$(".a3").hide();
    }
    }
    //抢麦回调
     function ClientOCX::OnControlMicState(msg){
    	 OnControlMicState(msg)
    }
    function OnControlMicState(msg){
    	var json=eval('('+msg+')');
    	 if(json.reason.reason==0){//成功
    		 interphoneFlag=true;
    		 var arrli=$('.members_list').find("li");
    		 for(var i=0;i<arrli.length;i++){
    				if($(arrli[i]).find("span").text()==json.speaker){
    					$(arrli[i]).find("span").css("class","speaking");
    					$(arrli[i]).find("em").text("正在讲话");
    				}
    			 } 
    	 }
    }
    //放麦回调
    function ClientOCX::OnReleaseMicState(msg){
    	 OnReleaseMicState(msg)
    }
    function OnReleaseMicState(msg){
    	var json=eval('('+msg+')');
    	 if(json.reason==0){//成功
    		 interphoneFlag=false;
    		 var arrli=$('.members_list').find("li");
    		 for(var i=0;i<arrli.length;i++){
    					$(arrli[i]).find("span").css("class","join");
    					$(arrli[i]).find("em").text("已加入");
    			 }
    	 }
    }
    //创建实时对讲后，回调函数：返回实时对讲id
    function ClientOCX::OnInterphoneState(msg){
    	OnInterphoneState(msg);
    }
    function OnInterphoneState(msg){
    	var json=eval('('+msg+')');
    	interphoneId=json.interphoneId;
    	//获取参与对讲成员
    	var members=ClientOCX.CCPqueryMembersWithInterphone(interphoneId);
    }
    //退出实时对讲
    function quit(){
    	interphoneId="";
    	var v=ClientOCX.CCPexitInterphone();
    	if(v=='0'){
    		$('.mask_dj').hide();
    		$('.speak_box').fadeOut();
    	}else{
    		alert("退出失败");
    	}
    }

    function joinInterphone(id){
    	//直接进入实施对讲
	    if(interphoneId==""){
	    	var v=ClientOCX.CCPjoinInterphone(id);
	    	if(v!='0'){
	    		alert("进入实时对讲失败!");
	    		return;
	    	}
	    }else{
	    	alert("请先退出当前实施对讲!");
	    }
    }
    
  //发送DTMF按键
    function CCPsendDTMF(dtmf){
    	var callid=$('#caller_callid').val();
    	//字符转换成unicode编码
    	ClientOCX.CCPsendDTMF(callid,dtmf.charCodeAt(0));
    }
    //收到DTMF按键
    function ClientOCX::OnDtmfReceived(msg){
    	OnDtmfReceived(msg);
    }
    function OnDtmfReceived(msg){
    	
    	alert(msg);
    }
    var iRowIndex = 1;
    
    	$(document).ready(function(){
    		var villageId = getQueryString("vid");
    		//InitiateSearchableDataTable.init();
    		var oTable = $('#searchable').dataTable({
                "sDom": "Tflt<'row DTTTFooter'<'col-sm-6'i><'col-sm-6'p>>",
                "oLanguage": {
                    "sLengthMenu": "_MENU_",
                    "sZeroRecords": "对不起，查询不到任何相关数据",
                    "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录",
                    "sInfoEmpty": "找不到相关数据",
                    "sInfoFiltered": "数据表中共为 _MAX_ 条记录)",
                    "sProcessing": "正在加载中...",
                    "sSearch": "",
                    "sUrl": "", 
                    "oPaginate": {
                        "sFirst":    " 首页",
                        "sPrevious": " 上一页 ",
                        "sNext":     " 下一页 ",
                        "sLast":     " 末页 "
                    }
                },
                "bStateSave": true,
                "bProcessing": false, 
         		"bServerSide": true,
         		"bSort": false,
         	    "sAjaxSource": "/WisdomHome/wisdomhome/unit_list",
         	    "fnServerData": retrieveData, 
         	    "aoColumns":
         	           [  
								{ "mData": "rowIndex",
								  "sDefaultContent" : "",
								  "sWidth":"60px",
								  "mRender": function (data, type, full) {
		         						return iRowIndex++;
		                     		}
								},
								{ "mData": "screenSize",
									  "sDefaultContent" : "",
									  "mRender": function (data, type, full) {
											if (full.screenSize == "1") {
												return "13吋";
											}else if(full.screenSize == "2"){
												return "9吋";
											}
					            		}
								},
								 { "mData": "type",
									  "sDefaultContent" : "",
									  "mRender": function (data, type, full) {
											if (full.type == "1") {
												return "单元门禁";
											}else if(full.type == "2"){
												return "区域门禁";
											}
					            		}
								},
					        	{ "mData": "placeDes","sDefaultContent" : ""},
					        	{ "mData": "number","sDefaultContent" : ""},
					        	{ "mData": "hardwareId","sDefaultContent" : ""},
					        	{ "mData": "ipAddress","sDefaultContent" : "未知"},
					        	{ "mData": "macAddress","sDefaultContent" : "未知"},
					        	{ "mData": "hardVersion","sDefaultContent" : "未知"},
					        	{ "mData": "softVersion","sDefaultContent" : "未知"},
					        	{ "mData": "online",
					        		"sDefaultContent" : "未知",
					        		"mRender": function (data, type, full) {
					        			var timestamp = parseInt(new Date().getTime());
					        			var timespan = parseInt(full.timeSpan);
					        			var lastrptime = parseInt(full.lastReportTime);
										if (timestamp - lastrptime <= timespan) {
											return "在线";
										}else {
											$.ajax({
												url:"/WisdomHome/um/offLine",
												data:{objectId:full.objectId},
												type:'post'
											});
											return '<font style="color:red;">离线</font>';
										}
				            		}
					        	},
								{ "mData": "operate",
		         	        		"sDefaultContent" : "",
		         	        		"sWidth":"160px",
		         	        		"mRender": function (data,type,full){
		         	        			return '<div class="btn-group">'+
		         	        			'<a class="btn btn-azure" title="'+full.objectId+'" href="#" onclick="unlock(this)">开门</a>'+
		         	        			'<a class="btn btn-azure dropdown-toggle" data-toggle="dropdown"><i class="fa fa-angle-down"></i></a>'+
		         		        		' <ul class="dropdown-menu dropdown-azure">'+
		         		        		'<li><a title="'+full.voipNumber+'" href="#" onclick="call(this)">呼叫</a></li>'+
		         		        		'<li><a title="'+full.objectId+'" href="#" onclick="restart(this)">重启</a></li>'+
		         		        		'<li><a title="'+full.objectId+'" href="#" onclick="reset(this)">重置</a></li>'+
		         		        		 '</ul></div>';
		         	        		}
		         	        	}
         	            ]
         		
            });
            
    		function retrieveData( sSource,aoData, fnCallback) {
            	iRowIndex = 1;
    			$.ajax({
    				"url" : sSource,
    				"data" : {"vid":villageId},
    				"type" : 'post',
    				"dataType" : 'json',
    				"success" : function(result) {
    					$('.loading-container').hide();
    					fnCallback(result);
    				},
    				"error" : function(msg) {
    					alert("error msg:"+msg.responseText);
    				}
    			});
    		}
    		
    		setInterval(function(){
    			oTable.fnReloadAjax();
    		}, 300000);
    	});
    	
    	
    	
    	function unlock(obj){
    		 $.ajax({
				"url" : "/WisdomHome/wisdomhome/user_centerUnlock",
				"data" : {"mid":obj.title},
				"type" : 'post',
				"dataType" : 'json',
				"success" : function(result) {
					if (result == 200) {
						alert("开锁成功！！！");
					}
				},
				"error" : function(msg) {
					alert("error msg:"+msg.responseText);
				}
			}); 
    	}
    	
    	function call(obj){
    		var called=obj.title;
    		var v=ClientOCX.CCPmakeCall(1,called);
    		var json=eval('('+v+')');
    		if(json.result=='0'){
    			//清空上次的计时显示
    			$('#thzDiv',parent.document).text("");
    			$('.mask_hr',parent.document).show();
    			$('.dialog_th',parent.document).show();
    			$('#caller_callid',parent.document).val(json.callid);
    			
    			$('#indexreject',parent.document).hide();
    			$('#indexaccept',parent.document).hide();
    			$('#indexend',parent.document).show();
    			//设置主页呼叫类型为视频
    			$('#caller_callType',parent.document).val("1");
    			$("#loading").css("visibility","hidden");
    		}else{
    			alert("错误码:"+json.result);
    		}
    	}
    	
    	function restart(obj){
    		 $.ajax({
 				"url" : "/WisdomHome/wisdomhome/user_centerRestart",
 				"data" : {"mid":obj.title},
 				"type" : 'post',
 				"dataType" : 'json',
 				"success" : function(result) {
 					if (result == 200) {
 						alert("门禁机重启成功！！！");
 					}
 				},
 				"error" : function(msg) {
 					alert("error msg:"+msg.responseText);
 				}
 			});
    	}
    	
		function reset(obj){
			$.ajax({
 				"url" : "/WisdomHome/wisdomhome/user_centerReset",
 				"data" : {"mid":obj.title},
 				"type" : 'post',
 				"dataType" : 'json',
 				"success" : function(result) {
 					if (result == 200) {
 						alert("门禁机重置成功！！！");
 					}
 				},
 				"error" : function(msg) {
 					alert("error msg:"+msg.responseText);
 				}
 			});
    	}
    </script>
</body>
</html>